<style lang="scss">
  .gdxx-div {
    outline: 1px dotted #cccccc;
    padding: 7px 0;
    margin-top: 7px;
    .repeat-div {
      border-bottom: 1px dotted #cccccc;
    }
    .cl-title {
      height: 36px;
      line-height: 36px;
      text-align: center;
      font-size: 16px;
      font-weight: bold;
    }
    .form-label input {
      background-color: #ffffff !important;
      border: #ffffff !important;
      padding-left: 0px !important;
    }
    .el-tabs__nav-scroll {
      display: flex;
      justify-content: center;
      .el-tabs__item {
        font-weight: bold;
        font-size: 16px;
        color: #666;
      }
    }
    .btn-div {
      margin: 20px 0;
      text-align: center;
    }
    .gdxx-file {
      a {
        text-decoration: none;
        color: #308ee5;
        padding-right: 36px;
      }
      .file-btn {
        color: #308ee5;
        text-decoration: underline;
        padding: 0 4px;
        cursor: pointer;
      }
      .file-btn:hover {
        color: blue;
      }
    }
    .rmw-file-div {
      a {
        text-decoration: none;
        color: #308ee5;
        padding-right: 36px;
        font-size: 16px;
      }
      .file-btn {
        color: #308ee5;
        text-decoration: underline;
        padding: 0 4px;
        cursor: pointer;
        font-size: 16px;
      }
      .file-btn:hover {
        color: blue;
      }
    }
  }
</style>

<template>
  <el-form :model="formItemData"
           ref="formItemData"
           label-width="80px"
           v-loading="loadingPage">
    <!-- 公众信箱-公众工单 -->
    <div class="gdxx-div"
         v-if="showGzxxDiv">
      <div class="repeat-div"
           v-for="item in formItemData.gdInfoEntityList"
           :key="item.code">
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="工单编号：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.code"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="来电(信)人：">
              <!-- <p size="small" disabled>{{item.income}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.income"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="联系人电话：">
              <!-- <p size="small" disabled>{{item.telphone}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.telphone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="联系人邮箱：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.email"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </div>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="系统来源：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.sourceName"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="信件标题：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].title"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="信件内容：">
            <el-input type="textarea"
                      autosize
                      rows="99"
                      size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].content"
                      resize="none"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="转办说明：">
            <el-input type="textarea"
                      autosize
                      rows="99"
                      size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].instruction"
                      resize="none"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </div>

    <!-- 大联动-事件工单 -->
    <div class="gdxx-div"
         v-if="showDldDiv">
      <div class="repeat-div"
           v-for="item in formItemData.gdInfoEntityList"
           :key="item.code">
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="工单编号：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.code"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="来电(信)人：">
              <!-- <p size="small" disabled>{{item.income}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.income"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="联系人电话：">
              <!-- <p size="small" disabled>{{item.telphone}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.telphone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="联系人邮箱：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.email"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </div>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="系统来源：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.sourceName"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="内容：">
            <el-input type="textarea"
                      autosize
                      rows="99"
                      size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].content"
                      resize="none"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="办理要求：">
            <el-input type="textarea"
                      autosize
                      rows="99"
                      size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].instruction"
                      resize="none"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </div>

    <!-- 市长信箱-电话工单\信件工单\信箱工单 -->
    <div class="gdxx-div"
         v-if="showSzxxDiv">
      <div class="repeat-div"
           v-for="item in formItemData.gdInfoEntityList"
           :key="item.code">
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="工单编号：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.code"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="来电(信)人：">
              <!-- <p size="small" disabled>{{item.income}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.income"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="联系人电话：">
              <!-- <p size="small" disabled>{{item.telphone}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.telphone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="联系人邮箱：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.email"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </div>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="系统来源：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.sourceName"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="主题：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].title"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="内容：">
            <el-input type="textarea"
                      autosize
                      rows="99"
                      size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].content"
                      resize="none"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </div>

    <!-- 企业服务 -->
    <div class="gdxx-div"
         v-if="showQyffDiv">
      <div class="repeat-div"
           v-for="item in formItemData.gdInfoEntityList"
           :key="item.code">
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="工单编号：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.code"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="来电(信)人：">
              <!-- <p size="small" disabled>{{item.income}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.income"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="联系人电话：">
              <!-- <p size="small" disabled>{{item.telphone}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.telphone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="联系人邮箱：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.email"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </div>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="系统来源：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.sourceName"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="主题：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].title"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="内容：">
            <el-input type="textarea"
                      autosize
                      rows="99"
                      size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].content"
                      resize="none"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </div>

    <!-- 市人社局信箱 -->
    <div class="gdxx-div"
         v-if="showSrsjDiv">
      <div class="repeat-div"
           v-for="item in formItemData.gdInfoEntityList"
           :key="item.code">
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="工单编号：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.code"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="来电(信)人：">
              <!-- <p size="small" disabled>{{item.income}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.income"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="联系人电话：">
              <!-- <p size="small" disabled>{{item.telphone}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.telphone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="联系人邮箱：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.email"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </div>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="系统来源：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.sourceName"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="主题：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].title"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="内容：">
            <el-input type="textarea"
                      autosize
                      rows="99"
                      size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].content"
                      resize="none"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </div>

    <!-- 人民网信箱 -->
    <div class="gdxx-div"
         v-if="showRmwDiv">
      <div class="repeat-div"
           v-for="item in formItemData.gdInfoEntityList"
           :key="item.code">
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="工单编号：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.code"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="来电(信)人：">
              <!-- <p size="small" disabled>{{item.income}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.income"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
        <el-row>
          <el-col :span="10"
                  :offset="1">
            <el-form-item label="联系人电话：">
              <!-- <p size="small" disabled>{{item.telphone}}</p> -->
              <el-input size="small"
                        :disabled="true"
                        :value="item.telphone"></el-input>
            </el-form-item>
          </el-col>
          <el-col :span="10">
            <el-form-item label="联系人邮箱：">
              <el-input size="small"
                        :disabled="true"
                        :value="item.email"></el-input>
            </el-form-item>
          </el-col>
        </el-row>
      </div>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="系统来源：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.sourceName"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="主题：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].title"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="内容：">
            <el-input type="textarea"
                      autosize
                      rows="99"
                      size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].content"
                      resize="none"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </div>

    <!-- 工单附件 -->
    <div class="gdxx-div"
         v-if="showFileDiv">
      <p class="cl-title">工单文件</p>
      <el-row class="gdxx-file">
        <el-col :span="20"
                :offset="1">
          <el-form-item label="文件：">
            <!-- formItemData.fileEntity.filePath -->
            <a href="javascript:void(0)">{{formItemData.fileEntity.fileName}}</a>
            <span class="file-btn"
                  @click="filePreview">查看</span>
            <span class="file-btn"
                  @click="fileDownload">下载</span>
          </el-form-item>
        </el-col>
      </el-row>
    </div>

    <!-- 流程信息 -->
    <div class="gdxx-div"
         v-if="showLcxxDiv">
      <p class="cl-title">处理流程</p>
      <el-row v-for="item in formItemData.gdHisEntityList"
              :key="item.wllzid">
        <el-col :span="20"
                :offset="1">
          <el-form-item label="流程：">
            <el-input type="textarea"
                      autosize
                      rows="99"
                      size="small"
                      :disabled="true"
                      :value=" '(' + item.deptName + ')' + item.empName + '在' + item.replyTime + ' ' + item.replyState + '：' + item.replyDescription"
                      resize="none"></el-input>
            <!-- <p size="small">({{item.deptName}}){{item.empName}}  在  {{item.replyTime}}  {{item.replyState}}： {{item.replyDescription}}</p> -->
          </el-form-item>
        </el-col>
      </el-row>
    </div>

    <!-- 处理信息 -->
    <div class="gdxx-div"
         v-if="showClxxDiv">
      <p class="cl-title">处理信息</p>
      <!-- <el-row>
        <el-col :span="5"
                :offset="1">
          <el-form-item label="紧急件：">
            <el-switch active-color="red"
                       inactive-color="lightgray"
                       v-model="formItemData.isImportant"
                       disabled></el-switch>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="工单类别：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.cateName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="执行处室：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.deptName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="处理时限：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.limitTime"></el-input>
          </el-form-item>
        </el-col>
      </el-row> -->
      <el-row>
        <el-col :span="4"
                :offset="1">
          <el-form-item label="紧急件：">
            <el-switch active-color="red"
                       inactive-color="lightgray"
                       v-model="formItemData.isImportant"
                       disabled></el-switch>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="工单类别：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.cateName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="5">
          <el-form-item label="执行处室：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.deptName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="处理时限：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.limitTime"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="备注：">
            <el-input type="textarea"
                      autosize
                      rows="99"
                      size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].remark ? formItemData.gdInfoEntityList[0].remark : '无'"
                      resize="none"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
    </div>

    <div class="gdxx-div"
         v-if="showClxxDiv">
      <p class="cl-title">回复信息</p>
      <el-row>
        <el-col :span="7"
                :offset="1">
          <el-form-item label="工单编号：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.gdInfoEntityList[0].code"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="6">
          <el-form-item label="回复人：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.empName"></el-input>
          </el-form-item>
        </el-col>
        <el-col :span="7">
          <el-form-item label="回复时间：">
            <el-input size="small"
                      :disabled="true"
                      :value="formItemData.handleTime"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <el-row>
        <el-col :span="20"
                :offset="1">
          <el-form-item label="回复内容：">
            <el-input type="textarea"
                      autosize
                      rows="99"
                      size="small"
                      :disabled="true"
                      :value="formItemData.handleDescription"
                      resize="none"></el-input>
          </el-form-item>
        </el-col>
      </el-row>
      <div class="rmw-file-div"
           v-if="showRmwFileDiv">
        <el-row>
          <el-col :span="20"
                  :offset="1">
            <el-form-item label="支撑材料：">
              <li>
                <a href="javascript:void(0)">{{formItemData.rmwFileEntity.fileName}}</a>
                <span class="file-btn"
                      @click="rmwFilePreview">查看</span>
                <span class="file-btn"
                      @click="rmwFileDownload">下载</span>
              </li>
            </el-form-item>
          </el-col>
        </el-row>
      </div>
    </div>

    <div class="gdxx-div send-btn-div"
         v-if="showClxxDiv">
      <el-tabs v-model="activeBtnName">
        <el-tab-pane label="关闭"
                     name="close">
          <!-- <el-row>
                <el-col :span="20" :offset="1">
                  <el-form-item label="关闭描述：">
                    <el-input v-model="formDataItem.description" type="textarea" rows="3" resize="none" size="small"></el-input>
                  </el-form-item>
                </el-col>
              </el-row> -->
          <div class="btn-div"
               v-if="showClxxDiv">
            <el-button type="primary"
                       @click="closeFn('formDataItem')"
                       :loading="loadingClose">关闭</el-button>
            <el-button @click="backFn">返回</el-button>
          </div>
        </el-tab-pane>
        <el-tab-pane label="下发"
                     name="again">
          <el-row>
            <el-col :span="12"
                    :offset="1">
              <el-form-item label="处理时限：">
                <el-date-picker v-model="formDataItem.limitTimeString"
                                align="right"
                                type="date"
                                size="small"
                                placeholder="选择日期"
                                :picker-options="pickerOptions">
                </el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="20"
                    :offset="1">
              <el-form-item label="执行处室：">
                <el-checkbox-group v-model="formDataItem.deptList">
                  <el-checkbox v-for="item in deptCheckBoxList"
                               :key="item.bmid"
                               :label="item.bmjc"
                               name="deptList"></el-checkbox>
                </el-checkbox-group>
              </el-form-item>
            </el-col>
          </el-row>
          <el-row>
            <el-col :span="20"
                    :offset="1">
              <el-form-item label="备注：">
                <el-input v-model="formDataItem.remark"
                          type="textarea"
                          rows="2"
                          resize="none"
                          size="small"></el-input>
              </el-form-item>
            </el-col>
          </el-row>
          <div class="btn-div"
               v-if="showClxxDiv">
            <el-button type="primary"
                       @click="againFn('formDataItem')"
                       :loading="loadingAgain">下发</el-button>
            <el-button @click="backFn">返回</el-button>
          </div>
        </el-tab-pane>
      </el-tabs>
    </div>
  </el-form>
</template>

<script>
  export default {
    name: 'already-detail',
    props: ['wllzid'],
    data () {
      return {
        loadingPage: false,
        // 表单数据
        formItemData: {
          sourceName: '',
          isImportant: false,
          isUnsatisfy: false,
          limitTime: '',
          deptName: '',
          empName: '',
          cateName: '',
          deacription: '',
          fileEntity: {
            fileName: '',
            filePath: ''
          },
          gdHisEntityList: [
            {
              deptName: '',
              empName: '',
              replyState: '',
              replyTime: '',
              replyDescription: ''
            }
          ],
          gdInfoEntityList: [
            {
              code: '',
              income: '',
              telphone: '',
              email: '',
              remark: ''
            }
          ]
        },
        // 保存数据
        formDataItem: {
          wllzid: '',
          description: '',
          limitTimeString: '',
          deptList: [],
          remark: '',
          deptListNew: []
        },
        // 处室选择
        deptCheckBoxList: [],
        // tab默认
        activeBtnName: 'close',
        // div显示隐藏
        showGzxxDiv: false,
        showDldDiv: false,
        showSzxxDiv: false,
        showQyffDiv: false,
        showSrsjDiv: false,
        showRmwDiv: false,
        showFileDiv: false,
        showLcxxDiv: false,
        showClxxDiv: false,
        showHfxxDiv: false,
        showThxxDiv: false,
        showBlxxDiv: false,
        showRmwFileDiv: false,
        // 加载
        loadingPage: false,
        loadingClose: false,
        loadingAgain: false,
        // 日期规则
        pickerOptions: {
          disabledDate (time) {
            return time.getTime() < Date.now()
          },
          shortcuts: [{
            text: '今天',
            onClick (picker) {
              picker.$emit('pick', new Date())
            }
          }, {
            text: '两天后',
            onClick (picker) {
              const date = new Date()
              date.setTime(date.getTime() + 3600 * 1000 * 24 * 2)
              picker.$emit('pick', date)
            }
          }, {
            text: '三天后',
            onClick (picker) {
              const date = new Date()
              date.setTime(date.getTime() + 3600 * 1000 * 24 * 3)
              picker.$emit('pick', date)
            }
          }, {
            text: '一周后',
            onClick (picker) {
              const date = new Date()
              date.setTime(date.getTime() + 3600 * 1000 * 24 * 7)
              picker.$emit('pick', date)
            }
          }]
        }
      }
    },
    methods: {
      detailFn: function () {
        const _this = this
        // 请求，解析内容
        _this.loadingPage = true
        this.$axios.get(_this.$api.service.alreadyInfo + '/' + _this.wllzid).then(rs => {
          if (rs) {
            _this.formItemData = Object.assign(_this.formItemData, rs)
            _this.formDataItem.wllzid = rs.wllzid
            _this.formDataItem.limitTimeString = this.formatHandleDateString(rs)
            _this.formItemData.limitTime = this.formatLimitDate(rs)
            _this.formItemData.handleTime = this.formatHandleDate(rs)
            // 判断工单文件
            if (rs.document === 1) {
              _this.showFileDiv = true
            }

            // 判断来源系统
            if (rs.sourceId == 12306) {
              _this.showSrsjDiv = true
            } else if (rs.sourceId == 12388) {
              _this.showRmwDiv = true
              // 人民网支撑材料
              if (rs.rmwFileEntity) {
                _this.showRmwFileDiv = true
              }
            } else if (rs.sourceId == 10086) {
              _this.showGzxxDiv = true
            } else if (rs.sourceId == 10010) {
              _this.showDldDiv = true
            } else if (rs.sourceId == 10000) {
              _this.showSzxxDiv = true
            } else if (rs.sourceId == 12580) {
              _this.showQyffDiv = true
            }

            // 流程信息
            if (rs.gdHisEntityList) {
              _this.showLcxxDiv = true
            }
            // 判断处理状态
            if (rs.handleState === 5) {
              _this.showThxxDiv = true
              _this.showHfxxDiv = true
            } else if (rs.handleState === 4) {
              _this.showBlxxDiv = true
              _this.showHfxxDiv = true
            }
            _this.showClxxDiv = true
            // _this.loadingPage = false
            // 修改查看状态
            _this.lookFn()
          }
        })
      },
      // 格式化日期
      formatLimitDate: function (data) {
        const _this = this
        var date = data.limitTime
        if (date === undefined) {
          return ''
        }
        return _this.$moment(date).format('YYYY年MM月DD日')
      },
      formatHandleDate: function (data) {
        const _this = this
        var date = data.handleTime
        if (date === undefined) {
          return ''
        }
        return _this.$moment(date).format('YYYY年MM月DD日HH时mm分ss秒')
      },
      formatHandleDateString: function (data) {
        const _this = this
        var date = data.limitTime
        if (date === undefined) {
          return ''
        }
        return _this.$moment(date).format('YYYY-MM-DD')
      },
      // 文件预览
      filePreview () {
        let fileUrl = this.formItemData.fileEntity.filePath
        this.$previewFile(fileUrl)
      },
      // 文件下载
      fileDownload () {
        let fileUrl = this.formItemData.fileEntity.filePath
        let fileName = this.formItemData.fileEntity.fileName
        this.$downloadFile(fileUrl, fileName)
      },
      // 文件预览
      rmwFilePreview () {
        let fileUrl = this.formItemData.rmwFileEntity.filePath
        this.$previewFile(fileUrl)
      },
      // 文件下载
      rmwFileDownload () {
        let fileUrl = this.formItemData.rmwFileEntity.filePath
        let fileName = this.formItemData.rmwFileEntity.fileName
        this.$downloadFile(fileUrl, fileName)
      },
      // 修改工单流程查看状态
      lookFn: function () {
        this.$axios.get(this.$api.service.look + '/' + this.wllzid).then(rs => {
          if (rs) {
            this.loadingPage = false
          } else {
            this.$message({ message: '查看工单信息错误...', showClose: true, type: 'danger' })
          }
        })
      },
      // 处室选择check-box
      getDeptCheckBoxList () {
        this.$axios.post(this.$api.dept.selector).then(rs => {
          if (rs) {
            this.deptCheckBoxList = rs
          }
        })
      },
      // 关闭
      closeFn: function () {
        const _this = this
        _this.loadingPage = true
        _this.loadingClose = true
        // 请求，关闭工单
        _this.$axios.post(_this.$api.service.close, _this.formDataItem).then(rs => {
          if (rs) {
            _this.$message({ message: '工单已关闭...', showClose: true, type: 'success' })
            _this.loadingPage = false
            _this.loadingClose = false
            _this.backFn()
          } else {
            _this.$message.error('工单关闭失败·')
            _this.loadingPage = false
            _this.loadingClose = false
          }
        })
      },
      // 二次下发
      againFn: function () {
        const _this = this
        if (_this.formDataItem.limitTimeString === null || _this.formDataItem.limitTimeString==='') {
          _this.$message({ message: '请选择处理时限', showClose: true, type: 'warning' })
          return
        }
        if (_this.formDataItem.deptList.length === 0) {
          _this.$message({ message: '请选择执行处室...', showClose: true, type: 'warning' })
          return
        }
        // 执行处室
        let { deptCheckBoxList } = this
        let arr = _this.formDataItem.deptList.map((item, index1) => {
          for (let index = 0; index < deptCheckBoxList.length; index++) {
            const element = deptCheckBoxList[index]
            if (item === element.bmjc) {
              return element.bmid
            }
          }
        })
        _this.formDataItem.deptListNew = arr
        // 拟办时限
        _this.formDataItem.limitTime = _this.formDataItem.limitTimeString
        // console.log(_this.formDataItem);
        // 请求，工单二次下发
        _this.loadingPage = true
        _this.loadingSave = true
        this.$axios.post(_this.$api.service.again, _this.formDataItem).then(rs => {
          if (rs) {
            _this.$message({ message: '已成功下发...', showClose: true, type: 'success' })
            _this.loadingPage = false
            _this.loadingSave = false
            _this.backFn()
          } else {
            _this.$message.error('工单下发失败，请及时联系技术人员...')
            _this.loadingPage = false
            _this.loadingSave = false
          }
        })
      },
      // 返回
      backFn: function () {
        this.$emit('dialogAlreadyCloseFn')
        this.$emit('getAlreadyPage')
      }
    },
    created: function () {
      this.detailFn()
      this.getDeptCheckBoxList()
    }
  }
</script>
